
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="/static/bootstrap-5.1.3-dist/css/bootstrap.css">
    <script type="text/javascript" src="/static/bootstrap-5.1.3-dist/js/bootstrap.js"></script>
    <title>我的购物车</title>
</head>
<style>
    .back{
        position: absolute;
        font-size: 26px;
        top:30px;
        left:40px;
        text-decoration: none;
        color: #000;
        font-weight: bold;
    }
    .back:hover{
        color: #000;
    }

    h2{
        text-align: center;
        margin-top: 15px;
    }

    .card{
        width: 1400px;
        height: 700px;
        background-color: #fffdfd;
        border-radius: 30px;
        border: none;
        box-shadow: 5px 5px 10px #adabab;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
    }
    table {
        text-align: center;
        vertical-align: middle !important;
        word-wrap:break-all;
        word-break:break-all;
        table-layout:fixed;

        width: 90% !important;
        margin-left: 80px;
        margin-top: 30px;

    }
    .caozuo{
        padding-top: 5px;
        padding-left: 70px;
    }
    .buy{
        position: absolute;
        bottom: 150px;
        left: 80px;
    }
    .buy button{
        margin-top: 10px;
    }
    .page {
        height: 50px;
        /*width: 1270px;*/
        /*margin-left: 1400px;*/
        position: fixed;
        bottom: 150px;
        right: 200px;
    }

</style>
<body>
<a href="${pageContext.request.contextPath}/market" class="back">
    <span><</span>返回</a>
<h2>我的购物车</h2>
<div class="card" >
    <table id="craft"  class="table table-bordered table-striped">
        <colgroup>
            <col width="100">
            <col width="200">
            <col width="200">
            <col width="250">
            <col width="200">
            <col width="300">
        </colgroup>
        <thead>
        <tr>
            <th>序号</th>
            <th>商品名称</th>
            <th>商品单价</th>
            <th>购买数量</th>
            <th>该商品总价格</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <c:forEach items="${itemsList}" var="items" varStatus="s">
            <c:forEach items="${goodsList}" var="goods" varStatus="s1">
                <c:if test="${items.goodid == goods.id}">
                    <tr>
                        <td>${s.index+1}</td>
                        <td>${goods.name}</td>
                        <td>${goods.price}</td>
                        <td>${items.good_cnt}</td>
                        <td>${items.price}</td>
                        <td>
                            <form action="items_mod" method="get" class="row g-3 caozuo">
                                <div class="col-auto">
                                    <input name="good_cnt" value="${items.good_cnt}" class="form-control" style="width: 50px">
                                </div>
                                <div class="col-auto">
                                    <button type="submit" class="btn btn-outline-primary mb-3">修改数量</button>
                                </div>
                                <input type="hidden" name="page" value="${pageInfo.pageIndex}">
                                <input type="hidden" name="itemsid" value="${items.id}">

                            </form>
                            <a type="button" class="btn-outline-danger" href="${pageContext.request.contextPath}/items_delete?itemsid=${items.id}&page=${pageInfo.pageIndex}">删除该条目</a>
                        </td>
                    </tr>
                </c:if>
            </c:forEach>
        </c:forEach>
        </tbody>
    </table>


    <div class="buy">
        <div>购物车中商品总价格为：${craft.price}</div>
        <form action="buying" method="get">
            <input type="hidden" name="craftid" value="${craft.id}">
            <button type="submit" class="btn btn-outline-success">确认支付</button>
        </form>
    </div>


    <div class="page">
        <nav aria-label="Page navigation example">
            <ul class="pagination justify-content-between">
                <c:if test="${pageInfo.isLast && falg == null}">
                    <li><a href="craft?page=${pageInfo.pageIndex-1}" class="page-link"><span
                            aria-hidden="true">&larr;</span> 上一页</a></li>
                </c:if>
                <c:if test="${pageInfo.isNext && falg == null}">
                    <li><a href="craft?page=${pageInfo.pageIndex+1}" class="page-link">下一页 <span
                            aria-hidden="true">&rarr;</span></a></li>
                </c:if>

            </ul>
            <span>第 ${pageInfo.pageIndex} 页/共 ${pageInfo.sumCount} 页</span>
        </nav>
    </div>

</div>

</body>
</html>
